<template>

    <van-tabbar v-model="active2" active-color="#FF2669">
      <van-tabbar-item to="/">
        <span>首页</span>
        <img
          slot="icon"
          slot-scope="props"
          :src="props.active ? icon1.active1 : icon1.normal">
      </van-tabbar-item>
      <van-tabbar-item to="/Mall">
        <span>商城</span>
        <img
          slot="icon"
          slot-scope="props"
          :src="props.active ? icon2.active1 : icon2.normal">
      </van-tabbar-item >
      <van-tabbar-item to="/member">
        <span>会员中心</span>
        <img
          slot="icon"
          slot-scope="props"
          :src="props.active ? icon3.active1 : icon3.normal">
      </van-tabbar-item>
      <van-tabbar-item to="/ShoppingCart">
        <span>购物车</span>
        <img
          slot="icon"
          slot-scope="props"
          :src="props.active ? icon4.active1 : icon4.normal">
      </van-tabbar-item>
      <van-tabbar-item @click="toxianxia">
        
        <span>线下商家</span>
        <!-- <a href="https://uath5.1-touchpay.com">
           
        </a> -->
        <img
          slot="icon"
          slot-scope="props"
          :src="props.active ? icon5.active1 : icon5.normal">
      </van-tabbar-item>
    </van-tabbar>
</template>

<script>
  export default {
    name: "FooterNav",
    props: {
      isBottom: {
        type: Boolean,
        default: true
      },
      active: {
        type: Number,
        default: 0
      }
    },
    data() {
      return {
        active2:this.active,
        icon1: {
            normal:require('../assets/home2.png') ,
            active1: require('../assets/Home-01.png')
        },
        icon2: {
            normal:require('../assets/shopping2.png') ,
            active1: require('../assets/shopping.png')
        },
        icon3: {
            normal:require('../assets/member2.png') ,
            active1: require('../assets/hui-01.png')
        },
        icon4: {
            normal:require('../assets/cart2.png') ,
            active1: require('../assets/cart.png')
        },
        icon5: {
            normal:require('../assets/user2.png') ,
            active1: require('../assets/user.png')
        },
      }
    },
    methods:{
      toxianxia(){
          window.location.href="https://uath5.1-touchpay.com"
      }
      // page(){
      //   if(this.active == 3){
      //     window.location.href = "/#/ShoppingCart"
      //   }else if(this.active == 1){
      //     window.location.href = "/#/"
      //   }
      // }
    }
  }
</script>

<style scoped>

</style>
